<template>
<div>
  <Drawer title="选择应用场景进入装户图" width="600" :closable="false" v-model="moduleModal">
<!--      <div v-for="(item,index) in moduleList" :label="item.name" :key="index" :name="index+''">-->
<!--        <Divider />-->
<!--        <h4 style="font-weight: bolder">{{item.name}}</h4>-->
<!--        <Divider />-->
<!--        <Row>-->
<!--          <Col v-for="(item1,index1) in item.children" :key="index1" span="8">-->
<!--            <Card style="height: 180px">-->
<!--              <div style="text-align: left;height: 80px">-->
<!--                <img v-if="item1.img1" :src="item1.img1" style="width: 65px;height: 65px"/>-->
<!--              </div>-->
<!--              <div style="margin-top: 15px">-->
<!--                <h5 style="font-weight: bolder">{{item1.name}}</h5>-->
<!--                <Row>-->
<!--                  <Col style="line-height: 20px" span="20">-->
<!--                    <span v-if="item1.is_click==='0' && item1.second_level_id !==undefined && item1.second_level_id !==''">{{item1.focusgroupUserNum}} 人</span>-->
<!--                  </Col>-->
<!--                  <Col span="4">-->
<!--                    <div v-if="item1.is_click==='0'" @click="pickModule(item1)">-->
<!--                      <svg t="1624851011072" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3767" width="20" height="20">-->
<!--                        <path d="M222.6944 222.7968A323.1488 323.1488 0 0 0 133.6832 512c19.2512-87.3728 64.512-172.7488 135.0144-243.3024C339.2512 198.1184 424.6272 152.8832 512 133.632c-101.632-19.1488-210.688 10.5216-289.3056 89.1648z" fill="#1296db" p-id="3768"></path>-->
<!--                        <path d="M989.44 822.1184l-121.7024-121.7024a118.016 118.016 0 0 0-92.8-34.1248c114.4576-165.5552 97.92-394.3936-49.4848-541.824-165.9392-165.9904-435.0464-165.9904-601.0368 0-165.9392 165.9904-165.9392 435.1232 0 601.1136 147.4048 147.4304 376.064 163.84 541.7216 49.3824-2.56 33.28 8.8576 67.5328 34.1248 92.8l121.7024 121.728c46.08 45.9776 121.3696 45.9776 167.3472 0 46.208-45.9776 46.208-121.2928 0.128-167.3728zM676.096 676.096c-138.6752 138.6752-363.392 138.6752-502.016 0-138.6752-138.6752-138.6752-363.4432 0-502.1184 138.624-138.6752 363.3408-138.6752 502.016 0 138.6496 138.5728 138.6496 363.4432 0 502.1184z" fill="#1296db" p-id="3769"></path>-->
<!--                      </svg>-->
<!--                    </div>-->
<!--                  </Col>-->
<!--                </Row>-->
<!--              </div>-->
<!--            </Card>-->
<!--          </Col>-->
<!--        </Row>-->
<!--      </div>-->
    <Card class="cardclassStyle" ref="aaaaa" v-for="(item,index) in moduleList" :key="index">
      <p slot="title">
        {{ item.name }}
      </p>
      <CellGroup v-for="(item1,index1) in item.children" :key="index1" >
        <Cell style="height: 40px" :disabled="item1.is_click==='1'">
          <div slot="label">
            {{item1.name}}
<!--            <img v-if="item1.img1" :src="item1.img1" style="width: 15px;height: 15px" slot="label"/>-->
            <span v-if="item1.is_click==='0' && item1.second_level_id !==undefined && item1.second_level_id !==''">{{item1.focusgroupUserNum}} 人</span>
          </div>
          <Button type="primary" slot="extra" shape="circle" icon="ios-search" :disabled="item1.is_click==='1'" @click="pickModule(item1)"></Button>
        </Cell>
      </CellGroup>
    </Card>
  </Drawer>
  <grid-person-new ref="gridPersonNew"></grid-person-new>
</div>
</template>

<script>
import { findModuleList } from '../../../../api/eventlist'
import GridPersonNew from './grid-person-new'

export default {
  name: 'grid-module',
  components: { GridPersonNew },
  data () {
    return {
      moduleModal: false,
      result: {},
      moduleList: []
    }
  },
  methods: {
    init (e) {
      this.moduleModal = true
      this.result = e
      let data = {
        building_id: this.result.id
      }
      findModuleList(data).then(ret => {
        if (ret.data.errcode === 0) {
          this.moduleList = ret.data.data
        } else {
          this.$Notice.error({
            title: '查询失败',
            desc: ret.data.errmsg
          })
        }
      })
    },
    pickModule (e) {
      console.log(1111111234567890)
      let data = {
        buildingInfo: this.result,
        moduleInfo: e
      }
      console.log(data)
      this.$refs.gridPersonNew.init(data)
    }
  }
}
</script>

<style scoped>
.cardClass{
  width: 100px;
  height: 100px;
  /*background-color: #F1F1F4;*/
  text-align: center;
  padding-top: 15%;
  /*line-height: 60px*/
}
.rowClass{
  background:#eee;
  padding-left:20px;
  padding-top:20px;
  padding-right:20px
}
.colClass{
  margin-bottom: 20px;
}
.cardclassStyle{
  width:100%;
  margin-bottom: 20px
}
</style>
